 模拟写法 
<!-- // Vue.component('header1', {
    //     data() {
    //         return {
    //             name: '我是header'
    //         }
    //     },
    //     beforeMount() {
    //         console.log('我是header1的 lifeCYle beforemount')
    //     },
    //     mounted() {console.log('我是header1的 lifeCYle  mount') },
    //     beforeUpdate() {console.log('我是header1的 lifeCYle beforeupdate') },
    //     updated() {console.log('我是header1的 lifeCYle updated') },
    //     beforeDestroy() {console.log('我是header1的 lifeCYle befordestory') },
    //     destroyed() {console.log('我是header1的 lifeCYle destroyed') },
    //     // 如果出现在外部 这个位置 需要在这里写吗？？？

    //     template:`<div ><div >
            helloworld  
               helloworld  
      
               
                  helloworld  
                     helloworld  
                        helloworld  
                           helloworld  
                              helloworld  
                                 helloworld  
                                    helloworld  
                                       helloworld  
                                          helloworld  
        </div></div>`
    // }) -->



    <template>
        <div >
            helloworld  
               helloworld  
      
               
                  helloworld  
                     helloworld  
                        helloworld  
                           helloworld  
                              helloworld  
                                 helloworld  
                                    helloworld  
                                       helloworld  
                                          helloworld  
                                          {{name}}
        </div>
      </template>
      
      <script>
       
      
      export default {
        name: '',
        props:[],
        components: {
         
        },
        data() {
          return {
              name；'我是header1'
          };
        },
        //方法 函数写这里
        methods: {},
        //计算属性
        computed: {},
        //侦听器
        watch: {},
        //过滤器
        filters: {},
        //以下是生命周期
        //组件创建之前
        beforeCreate() {},
        //组件创建之后
        created() {},
        //页面渲染之前
        beforeMount() {},
        //页面渲染之后
        mounted() {},
        //页面视图数据更新之前
        beforeUpdate() {},
        //页面视图数据更新之后
        updated() {},
         //页面销毁之前
        beforeDestroy() {},
        //页面销毁之后
        destroyed() {},
      }
      </script>
      
      
      <style   lang="scss"  scoped>
      
      </style>